<template>
  <div class="container">
    <div class="app-container">
      <template>
        <el-row>
          <span style="margin-left: 20px;">员工姓名：</span>
          <el-input placeholder="请输入一体杆名称" style="width: 200px;margin-right: 20px;margin-top: 20px;" size="mini" />
          <el-button type="primary" size="mini" style="border-radius: 4px;">查询</el-button>
        </el-row>
        <el-table v-loading="loading" :data="list" style="width: 100%;margin-top: 20px;">
          <el-table-column label="序号" type="index" />
          <el-table-column label="员工姓名" prop="name" />
          <el-table-column label="登录账号" prop="userName" />
          <el-table-column label="联系方式" prop="phonenumber" />
          <el-table-column label="角色" prop="roleName" />
          <el-table-column label="状态" prop="status">
            <template slot-scope="scope">
              <span v-if="scope.row.status == 0">未启用</span>
              <span v-else-if="scope.row.status == 1">启用</span>
            </template>
          </el-table-column>
          <el-table-column label="添加时间" prop="poleStatus" />
          <el-table-column label="操作">
            <template>
              <el-button type="text" size="mini">查看</el-button>
              <el-button type="text" size="mini">删除</el-button>
              <el-button type="text" size="mini">重置密码</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-row type="flex" justify="end">
          <el-pagination
            :page-sizes="[10,20,50,100]"
            :page-size="pageParams.pagesize"
            :current-page="pageParams.page"
            :total="pageParams.total"
            layout="total, prev, pager, next, sizes"
            @current-change="changePage"
            @size-change="changecurrent"
          />
        </el-row>
      </template>
    </div>
  </div>
</template>
<script>
import { getEmployeeListAPI } from '@/api'

export default {
  name: 'IntegratedPoleManagement',
  data() {
    return {
      loading: false,
      pageParams: {
        page: 1,
        pagesize: 5,
        total: 0
      },
      list: []
    }
  },
  created() {
    this.getEmployeeList()
  },
  methods: {
    async getEmployeeList() {
      this.loading = true
      const { rows, total } = await getEmployeeListAPI(this.pageParams)
      this.list = rows
      this.pageParams.total = total
      this.loading = false
    },
    async changePage(newPage) {
      this.loading = true
      this.pageParams.page = newPage // 赋值当前页码
      await this.getEmployeeList()
      this.loading = false
    },
    async changecurrent(newcurrent) {
      this.loading = true
      this.pageParams.pagesize = newcurrent
      await this.getEmployeeList()
      this.loading = false
    }
  }
}
</script>
